<head>
	<meta charset="utf-8">

	<link href="../css/styles.css" rel="stylesheet">
	<link rel="stylesheet" href="../css/bootstrap.min.css" type="text/css">
	<link rel="stylesheet" href="../css/font-awesome.min.css" type="text/css">
	<link rel="stylesheet" href="../css/themify-icons.css" type="text/css">
	<link rel="stylesheet" href="../css/elegant-icons.css" type="text/css">
	<link rel="stylesheet" href="../css/owl.carousel.min.css" type="text/css">
	<link rel="stylesheet" href="../css/nice-select.css" type="text/css">
	<link rel="stylesheet" href="../css/jquery-ui.min.css" type="text/css">
	<link rel="stylesheet" href="../css/slicknav.min.css" type="text/css">
	<link rel="stylesheet" href="../css/style.css" type="text/css">
	<link rel="stylesheet" href="../css/susu.css" type="text/css">
	<!-- Js Plugins -->
	<script src="../js/jquery-3.3.1.min.js"></script>
	<script src="../js/bootstrap.min.js"></script>
	<script src="../js/jquery-ui.min.js"></script>
	<script src="../js/jquery.countdown.min.js"></script>
	<script src="../js/jquery.nice-select.min.js"></script>
	<script src="../js/jquery.zoom.min.js"></script>
	<script src="../js/jquery.dd.min.js"></script>
	<script src="../js/jquery.slicknav.js"></script>
	<script src="../js/owl.carousel.min.js"></script>
</head>
<body >

<!--头部引入-->
<div class="su_head ">
</div>

<br />
		<div id="main-wrapper">
		
			<section class="gray pt-5 pb-5">

				<div class="container-fluid">
					<div class="row">
						<div class="col-lg-3 col-md-4 col-sm-12">
							<div class="property_dashboard_navbar">
								<div class="dash_user_avater">
									<img src="#" class="img-fluid avater" alt="" id="avater">
									<h4 id="avatername">姓名</h4>
								</div>
								<div class="dash_user_menues">
									<ul>
										<input type="text" class="form-control hidden" value="Yuanyuan" id="userid">
										<li ><a href="mypersonal.html"><i class="fa fa-user-tie"></i>个人信息</a></li>
										<li><a href="mycart.html"><i class="fa fa-bookmark"></i>我的收藏<span class="notti_coun style-2">7</span></a></li>
										<li><a href="myorder.html"><i class="fa fa-tasks"></i>我的交易</a></li>
										<li><a href="myinfo.html"><i class="fa fa-tasks"></i>我的发布</a></li>
						
										<li class="active"><a href="mypublish.html"><i class="fa fa-pen-nib"></i>发布信息</a></li>
										<li><a href="mypassword.html"><i class="fa fa-unlock-alt"></i>修改密码</a></li>
									</ul>
								</div>
								<div class="dash_user_footer">
									<ul>
										<li><a href="#"><i class="fa fa-power-off"></i></a></li>
										<li><a href="#"><i class="fa fa-comment"></i></a></li>
										<li><a href="#"><i class="fa fa-cog"></i></a></li>
									</ul>
								</div>
							</div>
						</div>

						<div class="col-lg-9 col-md-8">
							<div class="dashboard-body">
								<div class="dashboard-wraper" style="box-sizing: inherit">
									<div class="row">
										<div class="col-lg-12 col-md-12">
											<div class="submit-page">
												<div class="frm_submit_block">
													<h3 class="text-center">发布供求信息</h3>
													<div class="frm_submit_wrap">
														<div class="form-row">
															<input id="infoId" type="text" class="form-control hidden">
															<input id="typeInfoId" type="text" class="form-control hidden">
															<div class="form-group col-md-12"><label>信息标题<a
																		href="#" class="tip-topdata"
																		data-tip="需求信息"><i
																			class="ti-help"></i></a></label>
																<input id="infoTitle" type="text" class="form-control"></div>
															
															<div class="form-group col-md-12"><label>信息内容<a
																		href="#" class="tip-topdata"
																		data-tip="需求信息内容"><i
																			class="ti-help"></i></a></label>
																<input id="infoContent" type="text" class="form-control"></div>
															
															
															<div class="form-group col-md-6">
																<label>分类信息</label>
																<select id="status"
																	class="form-control select1-hidden-accessible su_category "
																	data-select1-id="status" tabindex="-1"
																	aria-hidden="true"  id="mycategory" onclick="mytype()">
																	<option value="1" data-select1-id="8"  >--请选择--</option>

																</select>
																<span
																	class="select2 select2-container select2-container--default"
																	dir="ltr" data-select2-id="13"
																	style="width: 442.1px;"><span
																		class="selection"><span
																			class="select2-selection select2-selection--single"
																			role="combobox" aria-haspopup="true"
																			aria-expanded="false" tabindex="0"
																			aria-labelledby="select2-status-container"><span
																				class="select2-selection__rendered"
																				id="select2-status-container"
																				role="textbox"
																				aria-readonly="true"><span
																					class="select2-selection__placeholder">一级分类</span></span><span
																				class="select2-selection__arrow"
																				role="presentation"><b
																					role="presentation"></b></span></span></span><span
																		class="dropdown-wrapper"
																		aria-hidden="true"></span></span></div>

															<div class="form-group col-md-6"><label>信息种类</label>
																<select id="ptypes"
																	class="form-control select2-hidden-accessible su_type"
																	data-select2-id="ptypes" tabindex="-1"
																	aria-hidden="true">
																	<option value="" data-select2-id="8">--请选择--</option>

																
																</select>
																<span
																	class="select2 select2-container select2-container--default"
																	dir="ltr" data-select2-id="5"
																	style="width: 442.1px;"><span
																		class="selection"><span
																			class="select2-selection select2-selection--single"
																			role="combobox" aria-haspopup="true"
																			aria-expanded="false" tabindex="0"
																			aria-labelledby="select2-ptypes-container"><span
																				class="select2-selection__rendered"
																				id="select2-ptypes-container"
																				role="textbox"
																				aria-readonly="true"><span
																					class="select2-selection__placeholder">二级分类</span></span><span
																				class="select2-selection__arrow"
																				role="presentation"><b
																					role="presentation"></b></span></span></span><span
																		class="dropdown-wrapper"
																		aria-hidden="true"></span></span></div>
															<div class="form-group col-md-6"><label>价格</label>
																<input id="infoPrice" type="text" class="form-control" value="1">
															</div>
															<div class="form-group col-md-6"><label>地址</label>
																<input id="infoAddress" type="text" class="form-control"></div>
															</div>
														<div  class="form-group col-md-6" ><label>图片<input type="file"  id="file" name="file" onchange="show(this)" value=""></label></div>

														</div>
															<div class="form-group col-md-6" id="showimage" style="display: none;" >
																<img id="myImg" src="" style="height: 132px;width:135px;position: absolute; z-index: 10"  >
															</div>

												</div>
											
											
			
												<div class="form-group col-lg-12 col-md-12">
												
													<ul class="no-ul-list">
														<li><input id="aj-1" class="" name="aj-1"
																type="checkbox"> <label for="aj-1">我已阅读发布信息<a href="#" ><span style="color: #00aed8">注意事项</span></a></label></li>
													</ul>
												</div>
												<div class="form-group col-lg-12 col-md-12">
													<button id="fb" class="btn btn-theme" type="button" onclick="publishinfo()">发布信息</button>
													<button id="xg" class="btn btn-theme hidden" type="button" onclick="editinfo()">修改信息</button>
												</div>
											</div>
										</div>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</section>


		</div>

		
		
	</body>
<script type="text/javascript">


	//调用公共头部
	$('.su_head').load('head.html');
	//获取导航栏信息
	$(document).ready(function () {
		$.ajax({
			type: 'get',
			url: '/ayuancity/categorys/getcategoryAndtype',
			success: function (res) {
				// console.log( $('.su_nav').text())
				for (let i = 0; i < res.content.data.length; i++) {

					let nav = res.content.data[i];
					var category =
							`
							<li id="${nav.categoryName}">
							<a href="itemsPage.html?categoryName=${nav.categoryName}">${nav.categoryName}</a>
							`;
					var drop = '';
					var type = '';
					if (nav.types.length > 0) {
						drop = ` <ul class="dropdown "  > `
						for (let j = 0; j < nav.types.length; j++) {
							type = type + `<li ><a href="itemsPage.html?categoryName=${nav.categoryName}&typeName=${nav.types[j].typeName}">${nav.types[j].typeName}</a></li>`

						}
						type = type + `</ul>`
					}
					var template = category + drop + type + ` </li>`;
					$('.su_nav').append(template);

				}
				// console.log($('.su_head').text());

				for (let i=0;i<res.content.data.length;i++){
					//
					let item=res.content.data[i]
					let template=`<option  value="${item.categoryId}" data-select1-id="11">${item.categoryName}
							</option>
						`
					$('.su_category').append(template)
				}
			}

		})
		// 判断是否登录 已登录 显示昵称
		let citytoken = sessionStorage.getItem('citytoken');
		if (citytoken) {
			$.ajax({
				type: 'GET',
				url: '/city/user/info',
				data: {
					token: citytoken
				},
				success: function (json) {
					if (json.success) {
						let username = json.content.user.userName;
						// console.log(json)
						$('#yuan-login').html(username);
						// $('#user-showname').html(showname);
						$('#yuan-login').attr('data-toggle', 'dropdown');
						$('#userid').attr("value",json.content.user.userId);
						$('#yuan-userImg').removeClass("hidden");
						$('#yuan-userImg').removeClass("hidden");
						$('#yuan-userImg').attr("src",json.content.user.userImg);
						$('#avater').attr("src",json.content.user.userImg);
						$('#avatername').html(json.content.user.userName);
					}
				}
			});
		}

		//判断是否是修改信息
		let url = location.href;
		let infoId = new URL(url).searchParams.get('infoId');
		if (infoId!=null){
			$.ajax({
				type: 'get',
				url: `/ayuancity/infos/${infoId}`,
				success: function (res) {
					console.log(res.content.data)
					let item=res.content.data;
					//标题
					$('#infoTitle').val(item.infoTitle);
					//内容
					$('#infoContent').val(item.infoContent);


					//分类信息
					// $('#status').html(item.categoryName);
					//信息种类
					// $('#ptypes').html(item.typeId);
					categoryoption(item.categoryName)
					mytype(item.categoryName,item.typeId);

					//价格
					$('#infoPrice').val(item.infoPrice);
					//地址
					$('#infoAddress').val(item.infoAddress);
					//图片
					$('#myImg').attr("src",item.infoImg);
					document.getElementById("showimage").style.display="block";

					$('#infoId').val(item.infoId);
					//地址
					$('#typeInfoId').val(item.typeInfoId);
					$("#fb").addClass("hidden")
					$("#xg").removeClass("hidden");
				}
		})}
	});

	function show(enven){
// 		  var url=document.getElementById("file").value;
		var url='';
		if (navigator.userAgent.indexOf("MSIE") >= 1) { // IE
			url = document.getElementById('file').value;
		} else if (navigator.userAgent.indexOf("Firefox") > 0) { // Firefox
			url = window.URL.createObjectURL(document.getElementById('file').files.item(0));
		} else if (navigator.userAgent.indexOf("Chrome") > 0) { // Chrome
			url = window.URL.createObjectURL(document.getElementById('file').files.item(0));
		}
		// alert(url)
		document.getElementById("myImg").src=url;
		document.getElementById("showimage").style.display="block";
		var file = enven.files[0];
		// var url = window.URL.createObjectURL(file)
		// console.log(url)
		// document.getElementById('upload').src=url
		var formData = new FormData();
		formData.append("fileList",file);
		$.ajax({
			type: 'POST',
			url: '/city/v1/uploadImage',
			data: formData,
			contentType : false,
			processData : false,
			success: function (json) {
				if (json.success) {
					console.log(json)
					document.getElementById('myImg').src=json.content.url
				}
			}
		});

	};
	function mytype(catename,typeId){
		$.ajax({
			type: 'get',
			url: '/ayuancity/categorys/getcategoryAndtype',
			success: function (res) {
				if (res.success) {
					for (let i=0;i<res.content.data.length;i++){
						let item=res.content.data[i]
						//一级分类的id
						let categoryid=$("#status").val()
		                if (item.categoryId==categoryid){
							$('.su_type').children('option').remove();
							$('.su_type').append(`<option value="" data-select2-id="8">--请选择--</option>`)
							for (let i=0;i<item.types.length;i++){
								let type=item.types[i]
								if (typeId== type.typeId){

									let template=`<option  selected="selected" value="${type.typeId}" >${type.typeName}</option>	`
									$('.su_type').append(template)
								}else{
									let template=`<option  value="${type.typeId}" >${type.typeName}</option>	`
									$('.su_type').append(template)
								}


							}
					       if (item.types.length==0){
							   let template=`<option  value="-1" >无
						      	</option>	`
								$('.su_type').append(template)
							}
						}

					}
				}
			}
		});
	};
	function categoryoption(catename){
		$.ajax({
			type: 'get',
			url: '/ayuancity/categorys/getcategoryAndtype',
			success: function (res) {
				if (res.success) {
					$('.su_category').children("option").remove()
					for (let i=0;i<res.content.data.length;i++){
						//
						let item=res.content.data[i]
						if (catename==item.categoryName){
							let template=`<option selected value="${item.categoryId}" data-select2-id="11">${item.categoryName}
							</option>
						`
							$('.su_category').append(template)
						}else{
							let template=`<option value="${item.categoryId}" data-select2-id="11">${item.categoryName}
							</option>
						`
							$('.su_category').append(template)
						}

					}
				}
			}
		});
	};

	function loginout() {
		$.ajax({
			type: 'POST',
			url: '/city/user/OutLogin',
			success: function (json) {
				if (json.success) {
					sessionStorage.removeItem('citytoken');
					alert("欢迎下次登录")
					location.href = 'index.html';
				}
			}
		});
	}


//	发布信息功能
	function publishinfo() {
		//一级分类id
		// console.log($("#status").val())
		//二级分类id
		// console.log($("#ptypes").val())
      $.ajax({
		  type: 'Post',
		  url: '/ayuancity/infos',
		  dataType:"json",
		  contentType: 'application/json;charset=UTF-8',
		  data: JSON.stringify({
			  infoTitle: $('#infoTitle').val(),
			  infoContent: $('#infoContent').val(),
			  infoPrice: $('#infoPrice').val(),
			  infoAddress: $('#infoAddress').val(),
			  infoImg: $('#myImg').attr("src"),
			  typeId: $("#ptypes").val(),
			  typeName:  $("#ptypes").val(),
			  userId: $('#userid').val(),
			  typeInfoId:$('#typeInfoId').val(),
		  }),
		  success: function (res){
            alert(res.message)
		  }
	  })

	};
	//修改信息

	function editinfo() {
		let formdata=JSON.stringify({
					infoId: $('#infoId').val(),
					infoTitle: $('#infoTitle').val(),
					infoContent: $('#infoContent').val(),
					infoPrice: $('#infoPrice').val(),
					infoAddress: $('#infoAddress').val(),
					infoImg: $('#myImg').attr("src"),
					typeId: $("#ptypes").val(),
					typeName:  $("#ptypes").val(),
					userId: $('#userid').val(),
					typeInfoId: $('#typeInfoId').val(),
					infoState:0
				});
		// infoState:0  修改后，状态为0
		$.ajax({
			type: 'Put',
			url: '/ayuancity/infos',
			dataType:"json",
			contentType: 'application/json;charset=UTF-8',
			data: formdata,
			success: function (res){
				alert(res.message)
			}
		})
	}

</script>
</html>
